<template>
  <div class="layadmin-pagetabs" id="LAY_app_tabs">
    <div
      class="layui-icon layadmin-tabs-control layui-icon-prev"
      layadmin-event="leftPage"
    ></div>
    <div
      class="layui-icon layadmin-tabs-control layui-icon-next"
      layadmin-event="rightPage"
    ></div>
    <div class="layui-icon layadmin-tabs-control layui-icon-down">
      <ul
        class="layui-nav layadmin-tabs-select"
        lay-filter="layadmin-pagetabs-nav"
      >
        <li class="layui-nav-item" lay-unselect="">
          <a href="javascript:;"><span class="layui-nav-more"></span></a>
          <dl class="layui-nav-child layui-anim-fadein">
            <dd layadmin-event="closeThisTabs">
              <a href="javascript:;">关闭当前标签页</a>
            </dd>
            <dd layadmin-event="closeOtherTabs">
              <a href="javascript:;">关闭其它标签页</a>
            </dd>
            <dd layadmin-event="closeAllTabs">
              <a href="javascript:;">关闭全部标签页</a>
            </dd>
          </dl>
        </li>
        <span class="layui-nav-bar"></span>
      </ul>
    </div>
    <div
      class="layui-tab"
      lay-unauto=""
      lay-allowclose="true"
      lay-filter="layadmin-layout-tabs"
    >
      <ul class="layui-tab-title" id="LAY_app_tabsheader">
        <li
          lay-id="home/console.do"
          lay-attr="home/console.html"
          class="layui-this lay-href"
        >
          <i class="layui-icon layui-icon-home"></i
          ><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>
        </li>
      </ul>
    </div>
  </div>
</template>
<style>
@import "../../../../assets/css/manager/admin.css";
</style>
<script>
export default {
  name: "Labels",
  data() {
    return {
      menuInfo: [],
    };
  },
  mounted: function () {
    layui.use("element", function () {
      var element = layui.element;
      element.on("tab(layadmin-layout-tabs)", function (data) {
        $(this).click();
      });
    });
  },
  methods: {
    deleteTabs: function (layid) {
      for (var i = 0; i < this.menuInfo.length; i++) {
        if (this.menuInfo[i] == layid) {
          this.menuInfo.splice(i, 1); // 将使后面的元素依次前移，数组长度减1
          i--;
        }
      }
    },
    loadTabs: function (t) {
      if (this.menuInfo == null || this.menuInfo.length == 0) {
        this.addLable(t);
      } else {
        for (var i = 0; i < this.menuInfo.length; i++) {
          if (this.menuInfo[i] == $(t).attr("lay-href")) {
            return false;
          }
        }
        this.addLable(t);
      }
      return true;
    },
    addLable: function (t) {
      if (this.checkIsNull(this.menuInfo)) {
        this.menuInfo = [];
      }
      var href = $(t).attr("lay-href");
      var title = $(t).attr("lay-tips");
      layui.use("element", function () {
        var element = layui.element;
        element.tabAdd("layadmin-layout-tabs", {
          title: title,
          id: href,
        });
      });
      this.menuInfo.push(href);
    },
  },
};
</script>